import DialogStore from ".";
import { action, observable, computed } from 'mobx';
import { Button, Modal, message } from 'antd';
import { WeaTools, WeaLocaleProvider } from 'ecCom'
import API from "../../apis/customCode";
import FormulaAPI from "../../apis/formula";
const getLabel = WeaLocaleProvider.getLabel;

export default class CodeEditorDialogStore extends DialogStore {

    @observable dsType = "0";
    @observable dataSource = [];
    @observable dbTables = [];
    @observable quickSearchValue = '';
    @observable tableLoading = false;
    @observable height = 0;
    @observable formulaList;
    @observable currentCodeContent;
    @observable currentId;
    @observable currentPageId;
    @observable defaultContent = '<script type="text/javascript">\n/*\n* ' +getLabel('528573','请在下面编写JS代码')+ "\n*/\n\n<\/script>";


    @observable editorType='code';
    @observable cusFormulaId='';
    @observable cusFormulaName='';
    @observable cusFormulaDesc='';
    @observable cusFormulaContent='';

    constructor(props) {
        super();
        this.style = { width: 620 };
        this.title = getLabel('505950', '代码块');
        this.buttons = [<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@s6z5lo@save`} type="primary" onClick={this.save}>{getLabel(30986, '保存')}</Button>,
        <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@p9lhys@cancel`} onClick={this.hide} type="primary">{getLabel(31129, '取消')}</Button>]
    }

    @action openCodeEditor = () => {
        if (!this.currentPageId) {
            message.error(getLabel('511951','请先保存模板，再创建代码块'));
            return;
        }
        this.queryById(this.currentPageId);
        this.open();
    }
    @action toggleEditor = () => {
        if(this.visible) {
            this.hide();
        } else {
            this.openCodeEditor();
        }
    } 

    @action setValue = (cusCode) => {
        this.currentCodeContent = this.defaultContent;
        if (cusCode) {
            this.currentCodeContent = cusCode ? WeaTools.Base64.decode(cusCode) : this.defaultContent;
        }
    }

    @action queryById = (id) => {
        API.queryCustomCodeById(id).then(this.setValue);
    }

    @action save = () => {
        if("code"===this.editorType){
            API.saveCustomCode({
                id: this.currentId,
                content: WeaTools.Base64.encode(this.currentCodeContent),
                pageid: this.currentPageId
            }).then((values) => {
                message.success(getLabel('502231', '保存成功'))
            });
        }else if('formula'===this.editorType){
            if(this.cusFormulaId){
                const aceEditorStore = this.parent().aceEditorStore;
                FormulaAPI.saveFormula({
                    id:this.cusFormulaId,
                    name:this.cusFormulaName,
                    content:WeaTools.Base64.encode(this.cusFormulaContent),
                    describes:this.cusFormulaDesc,
                    pageid:this.currentPageId
                }).then((values) =>{
                    aceEditorStore.formulaList = values;
                    aceEditorStore.loadFormula();
                    aceEditorStore.hide();
                    message.success(getLabel('502231','保存成功'))
                });
            }else{
                //无id时AceEditor为只读状态，此时点击保存给个提示即可
                message.success(getLabel('502231','保存成功'))
            }
        }
    }

    @action onChange = (value) => {
        this.currentCodeContent = value;
    }

    @action changeCusFormula = (value) => {
        this.cusFormulaContent = value;
    }
}